<template>
    <div class="top_fixed">
      <!-- 邦购商城下载 -->
      <div id="ad_wap_app_info"></div>
      <!-- 顶部导航栏 -->
      <div class="header_nav flex-box" style="display:nomal">
          <!-- logo -->
          <span class="header_logo"></span>
          <!-- 搜索栏 -->
          <div class="search_wrap flex-item-1 flex-box navSearch" style="margin: 0.2rem 0.45rem" v-on:click="searchBoxs()">
            <span class="search_ico "><icon class="bgwap-iconfont" name="searchindex"  viewBox="10 10 1000 1000 "></icon></span>
            <p v-if="item && item.WAP_search" class="search_tip flex-item-1">{{item.WAP_search.data.content["0"].ad_content_title}}</p>
          </div>
      </div> 
    </div>
</template>
<style>
    @import './../css/searchTop.css';
</style>
<script>
    import {
        TransferDom,
        Popup,
        Group,
        XSwitch,
        Scroller,
        Loading,
        Panel,
        XImg
    } from 'vux';
    export default {
        name: 'infoSearch',
        components: {
            TransferDom,
            Popup,
            Group,
            XSwitch,
            Scroller,
            Loading,
            Panel,
            XImg
        },
        data() {
            return {
                item: {},
                pannel: {},
                selected: true,
                show: false,
                info: "",
                data: [],
                secondData: [],
                swiperOption: {
                    //是一个组件自有属性，如果notNextTick设置为true，组件则不会通过NextTick来实例化swiper，也就意味着你可以在第一时间获取到swiper对象，假如你需要刚加载遍使用获取swiper对象来做什么事，那么这个属性一定要是true  
                    notNextTick: true,
                    pagination: '.swiper-pagination',
                    slidesPerView: 'auto',
                    centeredSlides: true,
                    paginationClickable: true,
                    spaceBetween: 30,
                    onSlideChangeEnd: swiper => {
                        //这个位置放swiper的回调方法  
                        this.page = swiper.realIndex + 1;
                        this.index = swiper.realIndex;
                    }
                }
            }
        },
        //定义这个sweiper对象  
        computed: {

            swiper() {
                return this.$refs.mySwiper.swiper;
            },
            jumpSearch() {
                location.href = 'http://localhost:8066/#/search'
                    // this.$router.push('/search')
            }

        },
        methods: {
            iconClose() {
                document.querySelector('.searchbox').style.display = 'none';
                document.querySelector('.bg_wap_frame').style.display = 'block'
            },
            searchBoxs() {
                // bg_wap_frame
                document.querySelector('.bg_wap_frame').style.display = 'none'
                document.querySelector('.searchbox').style.display = 'block';
                // this.showsearch = !this.showsearch;
                // alert(1)
            },
            onProfileClick() {
                var _this = this;
                this.$vux.confirm.show({
                    title: '操作提示',
                    content: '您确定要登出系统？',
                    onCancel() {},
                    onConfirm() {
                        _this.$router.push('/login')
                    }
                })
            },
        },
            mounted: function() {
                this.$http.get("index.php/dvert/getDvertInfo?siteMark=wap_index&ts=1503969642").then(function(data) {
                    var items = Function(data.body + ";return adList;")();
                    // debugger;
                    this.item = items;
                    console.log(this.item);
                    // 第二种方法
                    // this.$http.get('index.php/dvert/getDvertInfo?siteMark=wap_index&ts=1500380387').then((response) => {       
                    //  var data = response.data;  
                    //     this.data =JSON.parse(data.substr(13));   
                    //      }, (response) => {
                    //       console.log('error');
                });
                // 第二条数据
                this.$http.jsonp("http://mact.banggo.com/plate/GetPlateContent?_ksTS=1503928461159_72&callback=jsonp73&mark=wap_index&plate_id=375").then(
                    function(response) {
                        // 这里是处理正确的回调
                        this.pannel = response;
                        console.log(this.pannel);
                    },
                    function(response) {
                        // 这里是处理错误的回调
                        console.log(response)
                    });
            }
        }
</script>